<template>
    <div class="warp">
       <div class="floor" >
           <div class="title">
               <div class="Bigname">{{ data1.name }}</div>
               <!-- <div class="mininame">四季款</div> -->
           </div>
   
           <div class="shop" >
               <div class="shopList" v-for="item in data2" :key="data2.id">
                 <img class="shopimg" :src="item.listPicUrl" alt="">
                 <div class="shopName">{{ item.name }}</div>
                 <div class="shopmoney">到手￥{{ item.sortOriginPrice    }}</div>
               </div>
               <!-- <div class="shopList">
                 <img class="shopimg" src="https://yanxuan-item.nosdn.127.net/38cd07a95f60ed615de12ccdcc34bb4d.jpg" alt="">
                 <div class="shopName">旅行住酒店自备，抗菌隔脏便携睡袋</div>
                 <div class="shopmoney">￥899</div>
               </div>
               <div class="shopList">
                 <img class="shopimg" src="https://yanxuan-item.nosdn.127.net/6aa0fae52fcde4560bf41660279dd1a8.png" alt="">
                 <div class="shopName">旅途轻松裸睡，一体设计</div>
                 <div class="shopmoney">￥5899</div>
               </div> -->
           </div>
       </div>
    </div>
   
</template>
   <script lang="ts">
   import {computed, defineComponent,ref} from 'vue';
   import type {} from '@/api/home/home'
   export default defineComponent({
    name: 'Floor'
   })
   </script>
   <script setup lang="ts">
   const props = defineProps<{
       floorData1:{
           category:{},
           itemList:[],
           itemIdList:[]
       },
       itemList:any
   }>()
      const data1 = ref()
      const data2 = ref()
      data1.value = props.floorData1.category
      
      data2.value = props.floorData1.itemList
   
   </script>
   
   <style scoped>
   .warp{
       width: 100%;
       height: 100%;
       background-color: #eeeeee;
   }
   .floor{
       margin-top: 20px;
       background-color: white;
   }
   .title{
       width: 100%;
       height: 60px;
       display: flex;
       flex-directiona: column;
       justify-content: space-around;
       text-align: center;
   }
   .Bigname{
       font-size: 20px;
   }
   .mininame{
       font-size: 14px;
       color: #999;
   }
   .shop{
       width: 100%;
       display: flex;
       flex-wrap: wrap;
   }
   .shopList{
       box-sizing: border-box;
       width: 50%;
       height: 275px;
       padding: 0 5px 26px 10px;
   }
   .shopimg{
       width: 100%;
       height: 172.5px;
       border-radius: 10px;
   }
   .shopName{
       font-size: 18px;
   }
   .shopmoney{
       font-size: 16px;
       color: red;
   }
   </style>